<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link rel="stylesheet" type="text/css" th:href="@{/statics/css/lib.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/statics/css/style.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/statics/css/1362.css}">
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
    <link rel="stylesheet" th:href="@{/statics/css/mdui/mdui.min.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/statics/css/semantic/semantic.min.css}">
    <script type="text/javascript" th:src="@{/statics/js/jquery-1.11.3.min.js}"></script>
    <script type="text/javascript" th:src="@{/statics/js/jquery-2.1.4.js}"></script>
    <script type="text/javascript" th:src="@{/statics/js/org1480746227.js}" data-main="baseMain"></script>
    <script th:src="@{/statics/js/jq-paginator.js}"></script>
    <script th:src="@{/statics/js/semantic/semantic.min.js}"></script>
    <script th:src="@{/statics/js/mdui/mdui.min.js}"></script>
    <title>显卡售后系统</title>
    <style type="text/css">
        html {
            background: rgb(247,247,247)
        }
        .icon_awesome {
            margin-right: 20px;
        }
        .demo {
            padding: 20px;
            margin-bottom: 20px;
            background-color: white;
        }
        .demo li{
            float:left
        }
        .demo li a{
            float:left
        }
        *, :after, :before {
            content:none;
        }
    </style>
</head>

<body style="background: rgb(247,247,247)">
<div id="header" class="index_nav" style="background-color: white;box-shadow: 0px 2px 3px #dedede">
    <div class="content">
        <a href="index.html" id="logo"><img th:src="@{/statics/images/1482810077929.png}" height="40"/></a>
        <ul id="nav">
            <li class="navitem">
                <a class="nav-a " th:href="@{'/web/index.html'}" target="_self"><span data-title="首页">首页</span></a>
            </li>
            <li class="navitem">
                <a class="nav-a active" th:href="@{'/web/product.html?pageNo=1&type=-1'}" target="_self">
                    <span data-title="产品展示">产品展示</span>
                </a>
            </li>
<!--            <li class="navitem">-->
<!--                <a class="nav-a " th:href="@{'/web/team.html'}" target="_self"><span data-title="我们团队">我们团队</span></a>-->
<!--            </li>-->
            <li class="navitem">
                <a class="nav-a " th:href="@{'/web/news.html/1'}" target="_self"><span data-title="资讯中心">资讯中心</span></a>
            </li>
<!--            <li class="navitem">-->
<!--                <a class="nav-a " th:href="@{'/web/contact.html'}" target="_self"><span data-title="联系我们">联系我们</span></a>-->
<!--            </li>-->
            <li class="navitem">
                <a th:if="${session.user} == null" class="nav-a " th:href="@{'/web/login.html'}" target="_self"><span data-title="登录">登录</span></a>
                <a th:if="${session.user} != null" class="nav-a " onclick="inst.open()" href="javascript:void(0);" target="_self"><span data-title="个人信息" th:text="${session.user.account}"></span></a>
            </li>
        </ul>
        <div class="clear"></div>
    </div>
    <a id="headSHBtn" href="javascript:;"><i class="fa fa-bars"></i></a>
</div>
<div id="sitecontent">
    <div class="npagePage Pageanli" id="mproject">
        <div class="content" style="margin-top: 90px;overflow: hidden;padding: 0px 5px">
            <div id="projectlist" class="module-content" style="margin: 0 auto;float: none;width: 100%;padding-top: 50px">
                <div class="wrapper">
                    <ul class="content_list wow">
                        <li class="projectitem" th:each="project:${proList.records}" style="box-shadow: 0px 7px 17px #dedede;border: 1px rgba(255, 255, 255, 0) solid;">
                            <a th:href="@{'/web/project.html/'+${project.id}}" target="_self">
                                <div class="project_img" style="overflow: hidden;height: 300px">
                                    <img th:src="@{'/imagesWeb/'+${project.images.split(',')[0]}}"
                                         alt="" width="500" height="320"/>
                                </div>
                                <div class="project_info">
                                    <div style="border-bottom: 0">
                                        <p class="title" style="font-size: 15px" th:text="${project.name}"></p>
                                        <p class="subtitle"></p>
                                        <p class="description hide" th:text="${project.model}"></p>
                                    </div>
                                </div>
                            </a>
                            <a href="news_detail.html" target="_self" class="details">more<i class="fa fa-angle-right"></i></a>
                        </li>
                    </ul>
                </div>
                <div class="wow newstitem" th:if="${proList.records.size() == 0}" style="position: absolute;left: 50%">
                    <img th:src="@{/statics/images/em/no-data.png}"/>
                </div>
            </div>
            <div class="clear"></div>
            <div style="padding: 0px 25px">
                <div id="pages" class="demo customBootstrap" th:if="${proList.records.size() != 0}">
                    <p style="margin-bottom: 10px">当前第 <span id="demo1-text"></span> 页</p>
                    <ul id="demo1" class="pagination"></ul>
                </div>
            </div>
        </div>
    </div>
</div>
<div id="indexPage">
    <div id="mcontact" class="module" style="background-color: rgb(247,247,247);">
        <div class="bgmask"></div>
        <div class="content">
            <div class="header wow fadeInUp fw" data-wow-delay=".1s">
                <p class="title" style="margin-top: 60px">README</p>
            </div>
            <div id="contactlist" class="fw">
                <div id="contactinfo" class="fl wow" data-wow-delay=".2s">

                    <h3 class="ellipsis name">显卡售后服务</h3>
                    <p class="ellipsis add"><span>地点：</span>保密</p>
                    <p class="ellipsis zip"><span>邮编：</span>044000</p>
                    <p class="ellipsis tel"><span>电话：</span>199XXXX0631</p>
                    <p class="ellipsis mobile"><span>手机：</span>199XXXX0631</p>
                    <p class="ellipsis fax"><span>传真：</span>保密</p>
                    <p class="ellipsis email"><span>邮箱：</span>fan1ke2ke@gmail.com</p>
                    <div>
                        <a class="fl" href="javascript:;"><i class="fa fa-weibo"></i></a>
                        <a class="fl" href="javascript:;"><i class="fa fa-qq"></i></a>
                        <a class="fl" href="javascript:;"><i class="fa fa-weixin"></i></a>
                    </div>
                </div>
                <div id="contactform" class="fr wow" data-wow-delay=".2s">
                    <form action="#" method="post">
                        <p>
                            <input type="text" class="inputtxt name" name="name" placeholder="姓名" autocomplete="off"/>
                        </p>
                        <p>
                            <input type="text" class="inputtxt email" name="email" placeholder="邮箱" autocomplete="off"/>
                        </p>
                        <p>
                            <input type="text" class="inputtxt tel" name="tel" placeholder="电话" autocomplete="off"/>
                        </p>
                        <p>
                            <textarea class="inputtxt cont" name="content" placeholder="内容" autocomplete="off"></textarea>
                        </p>
                        <p>
                            <input class="inputsub" type="submit" value="提交"/>
                        </p>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="mdui-drawer mdui-drawer-close" id="drawer" style="background: rgb(247,247,247);">
    <img th:src="@{/statics/images/default_geocode-1x.png}" alt="" width="100%" height="80px"/>
    <ul class="mdui-list">
        <li class="mdui-list-item">
            <a class="ui teal image label">
                <img src="https://semantic-ui.com/images/avatar/small/veronika.jpg">
                <span th:if="${session.user} != null" th:text="${session.user.account}"></span>
            </a>
        </li>
        <li class="mdui-list-item mdui-ripple" onclick="window.open('/web/user','_self')">
            <div class="icon_awesome"><i class="fa fa-address-card" aria-hidden="true"></i></div>
            <div class="mdui-list-item-content">个人信息</div>
        </li>
        <li class="mdui-list-item mdui-ripple" onclick="window.open('/web/order/1','_self')">
            <div class="icon_awesome"><i class="fa fa-credit-card" aria-hidden="true"></i></div>
            <div class="mdui-list-item-content">我的工单</div>
        </li>
        <li class="mdui-list-item mdui-ripple" onclick="window.open('/web/system/1','_self')">
            <div class="icon_awesome"><i class="fa fa-thumbs-o-up" aria-hidden="true"></i></i></div>
            <div class="mdui-list-item-content">缴费记录</div>
        </li>
        <li class="mdui-list-item mdui-ripple" onclick="window.open('/web/message/1','_self')">
            <div class="icon_awesome"><i class="fa fa-list-alt" aria-hidden="true"></i></div>
            <div class="mdui-list-item-content">维修记录</div>
        </li>
        <li class="mdui-list-item mdui-ripple" style="position: fixed;bottom: 50px;width: 100%" onclick="window.open('/web/logout','_self')">
            <div class="icon_awesome red"><i class="fa fa-sign-out" aria-hidden="true" style="color: red"></i></div>
            <div class="mdui-list-item-content">退出登录</div>
        </li>
    </ul>
</div>

<div id="footer" style="margin-top: 15px">
    <p>
        COPYRIGHT (©) 2020 显卡售后服务
        <a href="http://www.beian.gov.cn/portal/index.do" style="width: 300px;margin-top: 0;margin-left: 50px"><img th:src="@{/statics/images/kimo.png}" style="margin-top: 10px"/>&nbsp;粤ICP备2021090004号-1</a>
    </p>
</div>
<div id="shares">
    <a id="sshare"><i class="fa fa-share-alt"></i></a>
    <a href="javascript:;" id="gotop"><i class="fa fa-angle-up"></i></a>
</div>
<div id="online_open"><i class="fa fa-comments-o"></i></div>
<div id="online_lx">
    <div id="olx_head">联系我们<i class="fa fa-times fr" id="online_close"></i></div>
    <ul id="olx_qq">
        <li>
            <a href="javascript:;" style="font-size: 14px; color: #777">问题答疑?</a>
        </li>
    </ul>
    <div id="olx_tel">
        <div style="color: #777"><i class="fa fa-phone" style="margin-right: 8px;"></i>请联系我们</div>
        <p style="color: #777; font-size: 16px">199XXXX0631<br/></p>
    </div>
</div>
</body>
<script type="text/javascript">
    var inst = new mdui.Drawer('#drawer', {overlay: true});
</script>
<script th:inline="javascript">
    $(document).ready(function(){
        var setCount = 0;
        var message = [[${proList}]];
        var key = [[${key}]];
        var type = [[${type}]];
        var pageNo = 1;
        $("#demo1").jqPaginator({
            totalPages: message.pages,
            visiblePages: 10,
            currentPage: message.current,
            page: '<li class="page"><a href="/web/product.html?pageNo={{page}}&type='+(type)+'">{{page}}</a></li>',
            onPageChange: function(n) {
                $("#demo1-text").html(n)
                pageNo = n
            }
        })
    });
</script>
</html>